Component({
    properties: {
      // 组件属性
      title: String,
      background: {
        type: String,
        value: '#fff'
      },
      color: {
        type: String,
        value: '#000'
      },
      back: {
        type: Boolean,
        value: true
      }
    },
    data: {
      statusBarHeight: 0,
      navBarHeight: 0,
      menuButtonInfo: null
    },
    lifetimes: {
      attached() {
        // 获取系统信息
        const systemInfo = wx.getDeviceInfo();
        
        // 获取尺寸信息
        const windowInfo = wx.getWindowInfo();
        
        // 获取微信官方根据不同机型进行适配的胶囊按钮的位置信息
        const menuButtonInfo = wx.getMenuButtonBoundingClientRect();
        
        // 计算导航栏高度
        const navBarHeight = (function() {
          let height;
          // iOS
          if (systemInfo.system.indexOf('iOS') > -1) {
            height = 44;
          } else {
            // 安卓：胶囊按钮上下边距 * 2 + 胶囊按钮高度
            height = (menuButtonInfo.top - windowInfo.statusBarHeight) * 2 + menuButtonInfo.height;
          }
          return height;
        })();
  
        this.setData({
          statusBarHeight: windowInfo.statusBarHeight,
          navBarHeight: navBarHeight,
          menuButtonInfo: menuButtonInfo
        });
      }
    }
  });